<!-- 我发起的活动 -->
<template>
	<color-header></color-header>
	<uni-nav-bar title="我发起的活动" left-icon="left" fixed clear-float status-bar :border="false"
	background-color="linear-gradient(to right, #CDE0F8, #C3F0F0, #DFF8F0)" 
	 @clickLeft="$navTo('',{}, 'navigateBack')"></uni-nav-bar>	
	<view class="activity-list" v-if="info.data != false">
		<activity-list v-for="(item, index) in info.data" :key="index" :info="item"></activity-list>
		<uni-load-more v-if="info.data.length >= 7" :status="loadStatus"></uni-load-more>
	</view>
	<empty-status v-else note="你还未发起过活动" src="/static/images/publish-empty.png" show-btn btn_text="我要发起活动" url="/pages/publish/index">
		<primary-btn title="我要发起活动"></primary-btn>
	</empty-status>
</template>

<script>
	export default {
		data() {
			return {
				loadStatus: 'more',
				info: {
					data: [],
					page: 1,
					hasMore: false,
				}
			}
		},
		onLoad() {
			this.getMyActivity()
			uni.$on('editSuccess', () => {
				this.getMyActivity()
			})
		},
		onUnload() {
			uni.$off('editSuccess')
		},
		// 刷新
		onPullDownRefresh() {
			uni.showLoading({
				mask: true
			})
			this.getMyActivity(true)
			setTimeout(() => {
				uni.hideLoading()
				uni.stopPullDownRefresh()
			}, 1000)
		},
		// 触底加载
		onReachBottom() {
			if (this.info.hasMore) {
				this.loadStatus = 'loading'
				this.info.page += 1
				this.getMyActivity()
			} else {
				this.loadStatus = 'noMore'
			}
		},
		methods: {
			async getMyActivity(refresh = false) {
				const res = await this.$request.get('/api/activity/created_activity',{page: this.info.page})
				this.loadStatus = 'more'
				if (res.code == 200) {
					this.info.hasMore = res.data.has_more_page
					const list = res.data?.lists || []
					if (refresh) {
						this.info.data = list
						this.info.page = 1
					} else {
						this.info.data = this.info.data.concat(list)
					}
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.activity-list {
		padding: 24rpx 30rpx;
	}
</style>